<template>
  <div class="g-content">
    <ul class="patientbox f-clear">
        <li class="patientli" @click="popInfoClick(item.name,item.sex,item.age,item.indays,item.level,item.number,item.innum)" v-for="(item, index) in patientNewlist" :key="index">
            <div class="baseinfobox">
                <span class="number">{{item.number}}</span>
                <div class="base">
                    <p class="name">{{item.name}}</p>
                    <p class="other"><span>{{item.sex}}</span><span>{{item.age}}岁</span><span>{{item.innum}}</span></p>
                </div>
            </div>
            <div class="hisinfo">{{item.hisinfo}}</div>
            <div class="eninfo">{{item.eninfo}}</div>
            <div class="docino"><span class="docname">{{item.doctorname}}</span><span class="time f-right">{{item.time}}</span></div>
            <div class="inway">
                <a class="waytag">{{item.ways}}</a>
                <div class="moretags f-right"><i class="red" v-show="item.degree">重</i><i class="org">入</i></div>
            </div>
            <span class="boxtag cred" :class="item.level==1?'cblue':'cred'"></span>
        </li>
    </ul>
    <div class="bottomoperate f-clear">
        <a class="optbtn">全</a>
        <a class="optbtn">重<i class="num">10</i></a>
        <a class="optbtn">危</a>
        <a class="optbtn">特</a>
        <a class="optbtn"><img src="../../../static/images/patimg/1.png"></a>
        <a class="optbtn"><img src="../../../static/images/patimg/2.png"></a>
        <a class="optbtn"><img src="../../../static/images/patimg/3.png"></a>
        <a class="optbtn">空</a>
        <a class="optbtn">现</a>
        <a class="optbtn">入</a>
        <a class="optbtn">待</a>
        <div class="sliderscale">
          <a-slider id="test" :defaultValue="21" :max="45" :tooltipVisible="true" @change="onChange" :min="1"/>
        </div>
    </div>

    <!--患者信息弹窗-->
    <PatientInfo v-show="infoflag" v-on:closeParent="closeParentClick" :patientlist="patientlist"></PatientInfo>
    <Floating-Menu :index = $route.query.index></Floating-Menu>
  </div>
</template>

<script>
import FloatingMenu from '../../publicComponent/FloatingMenu'
import PatientInfo from './PatientInfo.vue'
export default {
  name: 'patientlist',
  components: {
    PatientInfo,
    FloatingMenu
  },
  data () {
    return {
      infoflag: false,
      headParam: {
        title: '消化内科'
      },
      patientNewlist: [],
      patientlist: [
        {
          number: '01',
          name: '项云强',
          sex: '男',
          age: 45,
          innum: 1011288845,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1,
          degree: 1
        },
        {
          number: '02',
          name: '徐东娥',
          sex: '女',
          age: 52,
          innum: 1011289028,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '左科',
          time: '2019-06-11',
          ways: '全费',
          level: 2
        },
        {
          number: '03',
          name: '胡祁浩',
          sex: '男',
          age: 14,
          innum: 1011289028,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '全费',
          level: 1,
          degree: 1
        },
        {
          number: '04',
          name: '高应柱',
          sex: '男',
          age: 54,
          innum: 1011288845,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1
        },
        {
          number: '05',
          name: '严箐',
          sex: '女',
          age: 23,
          innum: 1011288845,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1,
          degree: 1
        },
        {
          number: '06',
          name: '谢露露',
          sex: '女',
          age: 33,
          innum: 1011288845,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 2
        },
        {
          number: '07',
          name: '冯悦娥',
          sex: '女',
          age: 22,
          innum: 1011288845,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1,
          degree: 1
        },
        {
          number: '08',
          name: '焦彪',
          sex: '男',
          age: 48,
          innum: 1011288845,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 2
        },
        {
          number: '09',
          name: '陈健健',
          sex: '男',
          age: 11,
          innum: 1011288845,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1
        },
        {
          number: '10',
          name: '包海龙',
          sex: '男',
          age: 24,
          innum: 1011288845,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1,
          degree: 1
        },
        {
          number: '11',
          name: '严鹏根',
          sex: '女',
          age: 52,
          innum: 1011288848,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 2,
          degree: 1
        },
        {
          number: '12',
          name: '周金良',
          sex: '男',
          age: 32,
          innum: 1011288848,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 2
        },
        {
          number: '13',
          name: '李玉宝',
          sex: '男',
          age: 15,
          innum: 1011285623,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1
        },
        {
          number: '14',
          name: '徐子敏',
          sex: '女',
          age: 42,
          innum: 1011284215,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1
        },
        {
          number: '15',
          name: '王麒麟',
          sex: '男',
          age: 12,
          innum: 1011285874,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1
        },
        {
          number: '16',
          name: '时得清',
          sex: '男',
          age: 36,
          innum: 1011285214,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 2,
          degree: 1
        },
        {
          number: '17',
          name: '王德祥',
          sex: '男',
          age: 26,
          innum: 1011283652,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 2
        },
        {
          number: '18',
          name: '陈宝梅',
          sex: '女',
          age: 47,
          innum: 1011282145,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1,
          degree: 1
        },
        {
          number: '19',
          name: '徐金玲',
          sex: '女',
          age: 31,
          innum: 1011282421,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1
        },
        {
          number: '20',
          name: '杨雪兰',
          sex: '女',
          age: 21,
          innum: 1011286523,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 1,
          degree: 1
        },
        {
          number: '21',
          name: '张雨欣',
          sex: '女',
          age: 28,
          innum: 1011289521,
          hisinfo: '过敏史',
          eninfo: 'JWS',
          doctorname: '焦晨峰',
          time: '2019-06-11',
          ways: '异地就医',
          level: 2,
          degree: 1
        }
      ]
    }
  },
  created: function () {
    this.patientNewlist = this.patientlist
  },
  methods: {
    popInfoClick: function (name, sex, age, indays, level, number, innum) {
      this.infoflag = true
      this.$router.push({
        query: {name: name, sex: sex, age: age, indays: indays, level: level, number: number, innum: innum}
      })
    },
    closeParentClick: function () {
      this.infoflag = false
    },
    onChange: function (val) {
      // console.log(this.patientlist)
      if (val > 1) {
        this.patientNewlist = this.patientlist.slice(0, val)
      } else {
        this.patientNewlist = this.patientlist.slice(0, 1)
      }

      // var zoomHtml = document.getElementsByTagName('html')
      // document.documentElement.style.zoom = 1.2
      // console.log(zoomHtml)
      if (this.patientNewlist.length < this.patientlist.length) {
        var a = this.patientlist.length
        var b = this.patientNewlist.length + 1
        var c = (a - b) * 0.05
        var element = document.getElementsByClassName('patientbox')[0]
        element.style.zoom = 1 + c
      }
    }
  }
}
</script>

<style lang="stylus" scoped>
  .sliderscale
    width:5.9rem;
    position: absolute;
    right: 0.2rem;
</style>
